// 引入unocss css
import '@/plugins/unocss'

// 导入全局的svg图标
import '@/plugins/svgIcon'

// 初始化多语言
import { setupI18n } from '@/plugins/vueI18n'

// 引入状态管理
import { setupStore } from '@/store'

// 全局组件
import { setupGlobCom } from '@/components'

// 引入 element-plus
import { setupElementPlus } from '@/plugins/elementPlus'

// 引入 form-create
import { setupFormCreate } from '@/plugins/formCreate'

// 引入全局样式
import '@/styles/index.scss'

// 引入动画
import '@/plugins/animate.css'

// 路由
import router, { setupRouter } from '@/router'

// 指令
import { setupAuth, setupMountedFocus } from '@/directives'

import { createApp, reactive } from 'vue'

import App from './App.vue'

import './permission'

import '@/plugins/tongji' // 百度统计
import Logger from '@/utils/Logger'

import VueDOMPurifyHTML from 'vue-dompurify-html' // 解决v-html 的安全隐患

// 1、引入 VTJ 相关功能
import { createProvider, LocalService, createModules } from '@vtj/web'
// 2、引用组件样式
import '@vtj/web/src/index.scss'

// 创建实例
const setupAll = async () => {
  // 3、实例化低代码服务类
  const service = new LocalService()
  
  // 4、创建低代码提供者实例
  const { provider, onReady } = createProvider({
    nodeEnv: import.meta.env.MODE, // 使用环境变量的MODE值，不进行类型断言
    modules: createModules({
      // 提供Vue响应式API，解决reactive未定义问题
      vue: { reactive },
      // 配置物料路径，确保能正确加载charts等模块
      materialOptions: {
        basePath: '/',
        // 使用本地物料，避免网络请求404
        useLocal: true
      }
    }),
    service,
    router,
    materialPath: '/' // 设置物料路径，解决History模式下404问题
  })
  
  // 5、低代码提供者初始化完成后注册
  onReady(async () => {
    const app = createApp(App)

    await setupI18n(app)

    setupStore(app)

    setupGlobCom(app)

    setupElementPlus(app)

    setupFormCreate(app)

    setupRouter(app)

    // directives 指令
    setupAuth(app)
    setupMountedFocus(app)

    await router.isReady()

    app.use(VueDOMPurifyHTML)
    app.use(router)
    app.use(provider)
    
    app.mount('#app')
  })
}

setupAll()

Logger.prettyPrimary(`欢迎使用`, import.meta.env.VITE_APP_TITLE)
